#!/soft/perl5.8.7-bin/perl

use CGI qw(:standard);

$q = new CGI;
$i = 0;
@files = <MyPhotos/*>;
foreach $file (@files) {
  $imageLocations[$i] = $file;
  $dLoc[$i] = join "","Descriptions/",$file,".txt";
  $descs[$i] = open (TEXT, $dLoc[$i]);
  $descText[$i] = <TEXT>;
  chomp($descText[$i]);
  close(TEXT);
  $i++;
  $totalImages = $i;
}

  print $q->header;
#  print $q->start_html(-title=>'INTERNETWEBS!!!!1!!11',-author=>'koene035@umn.edu',-TEXT=>"#000000");
print qq(<html>
<head>
<title>INTERNETWEBS!!1!11</title>);

print qq~<script type="text/javascript">
var imageArray = new Array();
var descriptionArray = new Array();
~; 

$i=0;
foreach $image (@imageLocations) {
  print qq(imageArray[$i] = "$imageLocations[$i]";);
  print("\n");
  print qq(descriptionArray[$i] = "$descText[$i]";);
  print("\n");
  $i++;
}
print qq~
var timeout;
var currentImage = 0;
var previousImage = 0;
var showRunning = 0;
var totalImages = "$totalImages";

function selectManual(imageName, manual){
  if(manual == false || showRunning == 0){
    document.getElementById(imageArray[previousImage]).style.border = '0px solid #000000';
    currentImage = imageArray.indexOf(imageName);
    previousImage = currentImage;
    document.getElementById(imageName).style.border = '3px solid #ff0000';
    document.getElementById('bigImage').src = imageName;
    document.getElementById('displayInfo').innerHTML = descriptionArray[currentImage];
  }
}

function autoNext(){
  selectManual(imageArray[(currentImage + 1) % totalImages], false);
}

function selectNext(){
  if(showRunning == 0) {
    selectManual(imageArray[(currentImage + 1) % totalImages]);
  }
}

function selectPrevious(){
  if(showRunning == 0) {
    selectManual(imageArray[((currentImage + totalImages - 1) % totalImages)], false);
  }
}

function startShow(){
  if(showRunning == 0){
    timeout = setInterval("autoNext()", 1000);
    showRunning = 1;
    document.getElementById('nextButton').disabled = true;
    document.getElementById('prevButton').disabled = true;
    document.getElementById('startButton').disabled = true;
  }
}

function stopShow(){
  clearInterval(timeout);
  showRunning = 0;
    document.getElementById('nextButton').disabled = false;
    document.getElementById('prevButton').disabled = false;
    document.getElementById('startButton').disabled = false;

}
~;

print qq(</script>); 

print qq~
</head>
<body onload="selectManual(imageArray[0])">
~;
if(! $q->param() ) {
print $q->hidden('control', "upload");
$encoding="multipart/form-data";
print button(-value=>'Next',-id=>'nextButton',-onclick=>'selectNext()');
print button(-value=>'Previous',-id=>'prevButton',-onclick=>'selectPrevious()');
print('<br/>');


$i=0;
foreach $image (@imageLocations) {
print $q->image_button(-name=>"thumb",-id=>"$imageLocations[$i]",-src=>"$imageLocations[$i]",-allign=>'LEFT',-height=>'50px',-width=>'50px',-onclick=>"selectManual(this.id, true)");
print("\n");
$i++;
}

print $q->start_form(-enctype=>$encoding);
print("<hr/>");
print button(-value=>'Start Slideshow',-id=>'startButton',-onclick=>'startShow()');
print button(-value=>'Stop Slideshow',-id=>'stopButton',-onclick=>'stopShow()');
print("<br />");
print $q->end_form;
print qq~
<img name="biggySmall" id="bigImage" height="300" width='500' src="$imageLocations[$currentImage]"> <br/><div id="displayInfo"></div><br/><hr/>Contribute to the Collection!~;
print $q->start_form(-enctype=>$encoding);
print $q->filefield(-name=>'uploadFile',-default=>'',-size=>10,-maxlength=>350);
print $q->submit("Upload  Image");
print $q->textfield(-name=>'description',-maxlength=>'100');
print $q->end_form;
}
else {
print qq(Image Uploading not supported.<br/> <a href="">Click here to return to the slideshow</a>);
}
print qq(</body></html>);
